//获取操作对象
var boxs = document.querySelectorAll(".common");
var lists //把数组变为全局变量方便使用
var ar1
var price1,id1
// 获取传入的cookie 
var num1 = getCookie("num")
// 判断是否登录
if (num1) {
    show1()

} else {
    alert("您还未登录")
    // 获取当前地址
    var url = location.href
    location = './login.html?url2=' + url
}




function show1() {
    lists = localStorage.getItem(num1) || "[]"
    lists = eval("(" + lists + ")")
    // console.log(lists)
    // 检查当前数组中所有is_select字段是否都等于1
    var bool = lists.every(item => {
        return item.is_select == 1
    })

    // 创建字符串拼接所有内容
    str = ` <h2>购物车</h2>
    <div class="head"><span>全部商品<i>${lists.length}</i></div>
    <ul class="ulTitle">
        <li><input type="checkbox" name="quan" ${bool?"checked":""}>全选</li>
        <li>
            商品信息
        </li>
        <li>数量</li>
        <li>金额</li>
        <li>操作</li>
    </ul>
    <div class="contentGoods">`
    lists.forEach(item => {
        str += `
        <ul>
            <li><input type="checkbox" name="xuan" ${item.is_select==1?"checked":''} data-id=${item.goods_id} > <img src="${item.goods_img1}" alt=""></li>
            <li>
            ${item.goods_name} | ${item.cart_id.substr(0,9)}</li>
            <li>款式：${item.cart_id.substr(-3,3)}
                <br>
                尺码：XS
               
            </li>
            <li><button data-id=${item.goods_id} ${item.cart_number<=1?"disabled":""}>-</button>
                <input type="text" >${item.cart_number}
                <button  data-id=${item.goods_id} ${item.cart_number>=item.goods_number?"disabled":""}>+</button></li>
            <li>￥<span class='xiaoji'>${item.cart_number>1?item.add_price:item.goods_price}</span></li>
            <li data-id=${item.goods_id}>删除</li>
        </ul>
        `

    })
    str += `
    </div>
    <div class="floor">
    <div><input type="checkbox" name="quan" ${bool?"checked":""}>全选</div>
    <ul>
        <li>已选商品:<span>${total1()[0]}</span>件   </li>
        <li>合计（不含运费）:<span>${total1()[1]}<span></li>
        <li>结算</li>
    </ul>
        </div>
    </div>
    `
    boxs[2].innerHTML = str
}

   // 使用事件委托，绑定大盒子点击事件
   boxs[2].onclick = function (e) {
    var e = e || window.event
    var tg = e.target || e.srcElement
    // 设置删除
    if (tg.innerHTML == "删除") {
        // 获取当前id
        var id = tg.getAttribute("data-id")
        lists = lists.filter(item => {

            return item.goods_id != id
        })
        // 重新把结果放入localStorage中
        localStorage.setItem(num1, JSON.stringify(lists))
        // 重新显示页面
        show1()
    }


    //设置加号
    if (tg.innerHTML == "+") {
        // 设置初始数量
        num1 = 0
        //获取当前按钮的id属性
        var id = tg.getAttribute('data-id')
        //遍历数组中所有元素
        lists.forEach(item => {
            //判断当前遍历的元素id是否等于按钮所对应的id
            if (item.goods_id == id) {
                item.cart_number++
                num1 += item.cart_number
                item.add_price = (item.goods_price*num1).toFixed(2)
            }
        })
        //把操作结果重新存放在localStorage中
        localStorage.setItem(num1, JSON.stringify(lists))
        //重新调用显示数据的函数
        show1()
    }
    //设置减号
    if (tg.innerHTML == '-') {
        // 设置初始数量
        num2 = 0
        //获取当前按钮的id
        var id = tg.getAttribute('data-id')
        //遍历数组元素
        lists.forEach(item => {
            //判断当前元素中的id是否等于按钮的id
            if (item.goods_id == id) {
                item.cart_number--
                num2 += item.cart_number
                item.add_price = (item.goods_price*num2).toFixed(2)
            }

        })
        //把操作结果重新存放在localStorage中
        localStorage.setItem(num1, JSON.stringify(lists))
        //重新调用显示数据的函数
        show1()
    }
    //设置全选框
    if (tg.name == "quan") {
        //遍历数组中所有商品
        lists.forEach(item => {
            //判断全选框是否被选中
            if (tg.checked) {
                //让商品中的is_select字段为1
                item.is_select = 1
            } else {
                item.is_select = 0
            }
        })
        //把操作结果重新存放在localStorage中
        localStorage.setItem(num1, JSON.stringify(lists))
        //重新调用显示数据的函数
        show1()
    }
    // 设置选中框
    if (tg.name == "xuan") {
        // 获取当前id
        var id = tg.getAttribute("data-id")
        // 遍历数组中元素 
        lists.forEach(item => {
            if (id == item.goods_id) {
                if (tg.checked) {
                    item.is_select = 1
                } else {
                    item.is_select = 0
                }
            }
        })
        //把操作结果重新存放在localStorage中
        localStorage.setItem(num1, JSON.stringify(lists))
        //重新调用显示数据的函数
        show1()

    }
    //设置结算
    if (tg.innerHTML == "结算") {
        // 弹出询问确认框
        if (confirm("您是否确认好商品无误，是否支付？")) {
            alert("已支付：" + total1()[1])
            // 删除已购买的商品
            lists = lists.filter(item => {
                // 删除选中的商品
                return item.is_select != 1
            })
            //把操作结果重新存放在localStorage中
            localStorage.setItem(num1, JSON.stringify(lists))
            //重新调用显示数据的函数
            show1()
        }
    }
}



//创建所选商品价格和数量
function total1() {
    var num1 = 0 //表示所选数量合计
    var num2 = 0 //表示所选价格合计
    lists.forEach(item => {
        // 判断商品是否被选中
        if (item.is_select == 1) {
            // 计算数量
            num1 += item.cart_number
            // 计算价格
            num2 += item.cart_number * item.goods_price
        }

    })
    return [num1, num2.toFixed(2)]
}